<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>登录注册表单</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!--图标库-->
    <link rel='stylesheet' th:href="@{https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css}" >

    <!--响应式框架-->
    <link rel='stylesheet' th:href='@{login/css/bootstrap.min.css}'>

    <!--主要样式-->
    <link rel="stylesheet" th:href="@{login/css/style.css}">


</head>

<body>

<div class="container">

    <div class="card-wrap">

        <div class="card border-0 shadow card--welcome is-show" id="welcome">
            <div class="card-body">
                <h2 class="card-title">添加用户界面</h2>

                <h2 class="card-title" style="color: red" th:text="${username}" th:if="${not #strings.isEmpty(username)}"></h2>
                <h2 class="card-title" style="color: red" th:text="${error}" th:if="${not #strings.isEmpty(error)}"></h2>
                <p>点击添加按钮添加</p>
                <div class="btn-wrap"><a class="btn btn-lg btn-register js-btn" data-target="register">添加
                </a>
                </div>
            </div>
        </div>

        <div class="card border-0 shadow card--register" id="register" disabled="">
            <div class="card-body">
                <h2 class="card-title">添加用户</h2>
                <form th:action="@{/addUser.do}" method="post">
                    <div class="form-group">
                        <input class="form-control" name="userCode" type="text" placeholder="登录的账号" required="required"/>
                    </div>
                    <div class="form-group">
                        <input class="form-control" name="userName" type="text" placeholder="显示的名称" required="required"/>
                    </div>
                    <div class="form-group">
                        <input class="form-control" name="usePassword" type="password" placeholder="密码" required="required"/>
                    </div>
                    <div class="form-group">
                        <select  class="form-control" name="gender" id="gender">
                            <option name="gender" value="1" selected="selected">性别--男</option>
                            <option name="gender" value="2">女</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <input class="form-control" name="birthday" type="date" placeholder="" required=""/>
                    </div>
                    <div class="form-group">
                        <input class="form-control" name="phone" type="text" placeholder="手机号" required=""/>
                    </div>
                    <div class="form-group">
                        <input class="form-control" name="address" type="text" placeholder="住址" required=""/>
                    </div>
                    <div class="form-group">
                        <input class="form-control" name="email" type="email" placeholder="邮箱" required="required"/>
                    </div>
                    <div class="form-group">
                        <select  class="form-control" name="userRole" id="userRole">
                            <option value="1" >系统管理员</option>
                            <option value="2">经理</option>
                            <option value="3" selected="selected">普通用户</option>
                        </select>
                    </div>
                    <button class="btn btn-lg">添加</button>
                </form>
            </div>
            <button class="btn btn-back js-btn" data-target="welcome"><i class="fas fa-angle-left"></i></button>
        </div>
    </div>
</div>

<script th:src="@{login/js/index.js}"></script>

</body>
</html>